<script setup>
import { reactive, onMounted } from "vue";
import { getWen } from "@/http/api.js";
import { Toast } from "vant";
import { useRouter } from "vue-router";
const router = useRouter();
const data = reactive({
  cont: "",
});
const id = localStorage.getItem("id");
onMounted(() => {
  getCont();
});
// 留言反馈
const getCont = async () => {
  let obj = {
    feedback_info: data.cont,
    user_id: id,
  };
  const res = await getWen(obj);
  console.log(res);
};
const Ok = () => {
  if (data.cont == "") {
    Toast.success("为空，你提交个der");
    return false;
  }
  getCont();
  Toast.success("成功");
  router.push("/my");
};
</script>
<template>
  <div class="xiao">
    <header>
      <van-icon name="arrow-left" @click="$router.back()" />
      <h3>问题反馈</h3>
    </header>
    <div class="box">
      <input
        type="text"
        v-model="data.cont"
        placeholder="请输入您的问题或反馈"
      />
      <button @click="Ok">提交</button>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.xiao {
  header {
    height: 88px;
    display: flex;
    align-items: center;
    margin-top: 20px;
    .van-icon {
      width: 60px;
      height: 60px;
      text-align: center;
    }
    h3 {
      flex: 1;
      text-align: center;
      font-size: 36px;
    }
  }
  .box {
    width: 90%;
    border: 1px solid #efefef;
    height: 300px;
    margin: 20px auto;
    input {
      color: #333;
      width: 100%;
      font-size: 26px;
      background: #fff;
      border: none;
      padding-left: 30px;
    }
    button {
      width: 100%;
      height: 1.17333rem;
      background: #f15a24;
      border-radius: 0.13333rem;
      text-align: center;
      line-height: 1.17333rem;
      font-size: 0.45333rem;
      font-family: HiraginoSansGB-W3;
      font-weight: 400;
      color: #fff;
      margin-top: 300px;
      border: none;
      outline: none;
    }
  }
}
</style>
